<template>
  <view class="container">
    <view class="tips">
      <view>批量释放库存会对账号状态和同步库存状态都为开启的渠道账号，且是由企橙发起的临时占用进行库存的释放。</view>
    </view>

    <view class="form-wrap">
      <ve-card>
        <ve-form :model="form" :rules="rules" ref="formRef">
          <ve-form-item label="释放周期" prop="fromTime" required labelPosition="top">
            <ve-daterange-picker
              v-model:start="form.fromTime"
              v-model:end="form.toTime"
              :placeholder="['开始时间', '结束时间']"
              mode="datetime"
            />
          </ve-form-item>
          <ve-form-item label="车牌号">
            <text>{{car.licenseNo}}</text>
          </ve-form-item>
          <ve-form-item label="车型" :borderBottom="false">
            <text style="text-align: right">{{car.modelName}}</text>
          </ve-form-item>
        </ve-form>
      </ve-card>
    </view>
    <ve-bottom-box>
      <ve-button type="primary" size="long" :loading="okLoading" @click="submitFn">确认</ve-button>
    </ve-bottom-box>
  </view>
</template>

<script setup name="CarStockTempUse">
  import { ref } from 'vue'
  import { platoonCarCheck, removeBatchTempUse } from '@/api/asset/car-stock'
  import { onLoad } from '@dcloudio/uni-app'
  const { foldValidate } = () => {} //useFormFold([])
  import useToast from '@/hooks/useToast'

  const form = ref({})
  const formRef = ref()
  const car = ref({})
  onLoad((options) => {
    car.value = options
    form.value = {
      carId: +car.value.carId,
      fromTime: undefined,
      toTime: undefined,
    }
  })

  const rules = {
    fromTime: [{ required: true, message: '请选择释放周期' }],
  }

  const okLoading = ref(false)
  const submitFn = () => {
    formRef.value.validate((valid, errors) => {
      if (valid) {
        okLoading.value = true
        removeBatchTempUse({...form.value})
          .then(() => {
            useToast({
              title: '批量释放成功',
            }).then(() => {
              uni.$emit('carStock:loadData')
              uni.navigateBack()
            })
          })
          .catch(() => {
            okLoading.value = false
          })
      } else {
        foldValidate(errors, true)
      }
    })
  }
</script>
<style lang="less" scoped>
  .container {
    min-height: 100vh;
  }
  .form-wrap {
    padding: 24rpx;
  }
  .tips {
    width: 100%;
    background: #e8f3ff;
    padding: 18rpx 32rpx;
    color: #1d2129;
    font-size: 24rpx;
    font-weight: 400;
  }
</style>
